<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>登录窗口</title>
<link rel="stylesheet" type="text/css" media="screen" href="/static/css/bootstrap.min.css">
</head>
<body>
    <div class="container">
        <div class="row" style="margin-top: 80px">
            <div class="col-md-4 col-md-offset-4">
                <div class="panel panel-primary">
                    <div class="panel-heading">登录</div>
                    <div class="panel-body">
                        <form id="loginForm">
                            <div class="form-group">
                                <label for="ipt-username">用户名</label>
                                <input type="text" id="ipt-username" name="userName" class="form-control" placeholder="请输入用户名">
                            </div>
                            <div class="form-group">
                                <label for="ipt-pwd">密码</label>
                                <input type="password" id="ipt-pwd" name="password" class="form-control" placeholder="请输入密码" value="">
                            </div>
                            <div class="form-inline text-right">
                                <button id="btn-login" type="button" class="btn btn-primary">登录</button>
                                <button type="reset" class="btn btn-default">重置</button>
                            </div>
                            <div id="error-message" class="text-danger"></div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>
<script src="../static/js/axios.min.js"></script>
<script>
    document.getElementById('btn-login').onclick = function () {
        const userName = document.getElementById('ipt-username').value;
        const pwd = document.getElementById('ipt-pwd').value;

        axios.post('/user/login', {
            "username": userName,
            "password": pwd
        }).then(function (response) {
            if (response.data.code === 200) {
                alert('登录成功');
                window.location = '/users/users.html';
            } else {
                document.getElementById('error-message').innerText = response.data.msg;
            }
        });
    }
</script>
</html>
